$floating-zindex: $z-sidebar + 1000

.btn-floating
  @include fixed($right: 30px, $bottom: 30px, $height: auto, $width: auto)
  z-index: $floating-zindex

  .btn-bg
    @include absolute($left: 0, $bottom: 0)
    border-radius: 50%
    background-color: $green
    box-shadow: 0 1px 3px $green
    z-index: $floating-zindex
    transition: all 0.3s ease


  .btn-toggle
    position: relative
    width: 60px
    height: 60px
    margin-bottom: 0
    @include flex($align: center, $justify: center)
    border: 0
    background-color: transparent
    box-shadow: none
    z-index: $floating-zindex + 2

    i
      font-size: 2em
      color: $white
    .help-text
      display: none

  .toggle-content
    @include absolute($bottom: 0, $right: 0, $width: auto, $height: auto)
    padding: 0
    margin: 0
    z-index: $floating-zindex + 2
    display: none

    ul.actions
      list-style: none
      padding: 0
      margin: 0
      & > li
        padding: 0
        a 
          display: block
          color: $white
          text-decoration: none
          padding: 10px 20px
          border-bottom: 1px solid rgba($white, .1) 
          text-transform: uppercase
          font-size: 0.9em

          &:hover
            cursor: pointer
            background-color: rgba($white, 0.1)

  &.active
    .btn-bg
      border-radius: 3px
    .btn-toggle
      display: none
    .toggle-content
      position: relative
      display: block